var app = new Vue({
    el: '.box',
    data: {
        tableData: '',//广告数据
        dialogFormVisible: false,//显示编辑界面
        dialogFormVisible1: false,//显示新建广告
        formLabelWidth: '70px',//宽度
        form: '',//编辑内容
        img1: '',//上传的图片
        form1: {
            name: '',
            href: '',
            start_time: '',
            over_time: '',
            type: '',
            flag1: '',
            ad_img: '',
            head: 1021,
            token: (sessionStorage.getItem('token'))
        },//新建内容
    },
    methods: {
        del(obj) {
            var arr = { ids: this.tableData[obj.$index].Id, head: 1022, token: (sessionStorage.getItem('token')) }
            this.$confirm('此操作将删除该广告, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                del_ad(arr);
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });
            // 删除
        },
        new_msgs(obj) {
            if (!this.form1.name) {
                this.$message.error('请输入广告名');
                return false;
            };
            if (!this.form1.href) {
                this.$message.error('请输入广告地址');
                return false;
            };
            if (!this.form1.over_time) {
                this.$message.error('请输入选择开始时间');
                return false;
            };
            if (!this.form1.start_time) {
                this.$message.error('请输入选择结束时间');
                return false;
            };
            if (!this.form1.type) {
                this.$message.error('请输入选择广告类型');
                return false;
            };
            if (!this.form1.ad_img || this.form1.ad_img.includes('blob:')) {
                this.$message.error('请输入上传图片');
                return false;
            };
            new_ad(this.form1);
        },
        save(obj, type) {
            if (type) {
                this.dialogFormVisible = true;
                this.tableData[obj.$index].head = 1020;
                this.tableData[obj.$index].token = (sessionStorage.getItem('token'));
                this.form = this.tableData[obj.$index];
                setTimeout(function () {
                    var select = document.querySelector('#select');
                    var photo = document.querySelector('#photo');
                    select.addEventListener('click', function () {
                        photo.click();
                    }, false);
                    photo.addEventListener('change', function () {
                        if (photo.files[0] || photo) {
                            app.img1 = window.URL.createObjectURL(photo.files[0]);
                        };//预览图片
                    }, false);
                }, 500);
            } else {
                this.form.flag = this.form.flag1 ? 1 : 0;
                this.form.img1 = this.img1;
                this.form.ad_img = this.img1 ? this.img1 : this.form.ad_img;
                save_ad(this.form);
            };
        },
        clear() {
            this.dialogFormVisible1 = true;
            this.form1.name = '';
            this.form1.href = '';
            this.form1.flag = true;
            this.form1.start_time = '';
            this.form1.over_time = '';
            this.form1.type = '';
            this.form1.flag1 = '';
            this.form1.ad_img = '';
            setTimeout(function () {
                var select = document.querySelector('#select');
                var photo = document.querySelector('#photo');
                select.addEventListener('click', function () {
                    photo.click();
                }, false);
                photo.addEventListener('change', function () {
                    if (photo.files[0] || photo) {
                        app.form1.ad_img = window.URL.createObjectURL(photo.files[0]);
                    };//预览图片
                }, false);
            }, 500);
        },
        upload() {
            upload_img();
        }
    },
});


function del_ad(obj) {
    var loading = app.$loading({
        lock: true,
        text: 'Loading',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
    });
    axios({
        method: "POST",
        baseURL: '../../api/ad.php',
        data: 'data=' + JSON.stringify(obj)
    }).then(function (res) {
        loading.close();
        if (res.data.code === '200') {
            app.$message({
                message: '删除成功~',
                type: 'success'
            });
            app.dialogFormVisible = false;
            app.dialogFormVisible1 = false;
            select_ad();
        } else if (res.data.code === '500') {
            window.location.href = res.data.href;
        } else {
            console.log(res);
        };
    }).catch(function (err) {
        console.log(err);
    });
};//删除广告


function new_ad(obj) {
    var loading = app.$loading({
        lock: true,
        text: 'Loading',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
    });
    obj.flag1 = obj.flag ? 1 : 0;
    axios({
        method: "POST",
        baseURL: '../../api/ad.php',
        data: 'data=' + JSON.stringify(obj)
    }).then(function (res) {
        loading.close();
        if (res.data.code === '200') {
            app.$message({
                message: '创建成功~',
                type: 'success'
            });
            app.dialogFormVisible = false;
            app.dialogFormVisible1 = false;
            select_ad();
        } else if (res.data.code === '500') {
            window.location.href = res.data.href;
        } else {
            console.log(res);
        };
    }).catch(function (err) {
        console.log(err);
    });
};

function save_ad(obj) {
    var loading = app.$loading({
        lock: true,
        text: 'Loading',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
    });
    if (obj.img1.includes('blob:')) {
        app.$message({
            message: '请先上传图片哦',
            type: 'warning'
        });
    } else {
        axios({
            method: "POST",
            baseURL: '../../api/ad.php',
            data: 'data=' + JSON.stringify(obj)
        }).then(function (res) {
            loading.close();
            if (res.data.code === '200') {
                app.$message({
                    message: '修改成功~',
                    type: 'success'
                });
                app.dialogFormVisible = false;
                app.dialogFormVisible1 = false;
                select_ad();
            } else if (res.data.code === '500') {
                window.location.href = res.data.href;
            } else {
                console.log(res);
            };
        }).catch(function (err) {
            console.log(err);
        });
    };
};//编辑广告

select_ad();
function select_ad() {
    var loading = app.$loading({
        lock: true,
        text: 'Loading',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
    });
    axios({
        method: "POST",
        baseURL: '../../api/ad.php',
        data: 'data=' + JSON.stringify({ head: 1018, token: (sessionStorage.getItem('token')) })
    }).then(function (res) {
        loading.close();
        if (res.data.code === '200') {
            for (var i = 0; i < res.data.data.length; i++) {
                res.data.data[i].flag1 = (res.data.data[i].flag - 0) === 1 ? true : false;
                res.data.data[i].flag2 = (res.data.data[i].flag - 0) === 1 ? true : false;
                res.data.data[i].ids = res.data.data[i].Id;
            };
            app.tableData = res.data.data;
            console.log(res);


        } else if (res.data.code === '500') {
            window.location.href = res.data.href;
        } else {
            console.log(res);
        };
    }).catch(function (err) {
        console.log(err);
    });
};//获取广告


function upload_img() {
    var loading = app.$loading({
        lock: true,
        text: 'Loading',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
    });
    var form1 = document.querySelector('#form2');
    var img_data = (new FormData(form1));
    console.log
    var xmlhttp;
    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    }
    else {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function () {
        loading.close();
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            var data = JSON.parse(xmlhttp.responseText);
            if (data.code === '200') {
                app.img1 = '../' + data.src;
                app.form1.ad_img = '../' + data.src;
                app.$message({
                    message: '上传成功~',
                    type: 'success'
                });
            } else {
                app.$message.error(data.msg);
            };
        };
    }
    xmlhttp.open("POST", '../../api/upload_img.php', true);
    xmlhttp.send(img_data);
};//上传图片

